<template>
  <div class="home-slider">
    <van-swipe :autoplay="5000" lazy-render>
      <van-swipe-item v-for="image in sliderList" :key="image">
        <img :src="image" alt="图片加载失败" />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script lang="ts">
import { defineComponent, computed, onMounted } from "vue";
import { useStore } from "vuex";

export default defineComponent({
  setup() {
    const store = useStore();
    const sliderList = computed(() => store.state.home.sliderList);
    onMounted(() =>
      store.dispatch({
        type: "home/getSliderList",
        data: {
          entityId: 4,
          modelId: -1,
          proModelId: 1,
          source: 3,
          version: "v1",
          advVersion: 1,
          tuserId: 771131,
          isWechat: 0,
        },
      })
    );
    return {
      sliderList,
    };
  },
});
</script>

<style lang="stylus" scoped>
.home-slider
    padding 0 .01rem
    .van-swipe
        width 100%
        height 1.4rem
        margin-bottom .05rem
        border-radius .1rem
        .van-swipe-item img
            width 100%
            height 100%
</style>
